
<html> 
    <head> 
        <title>Buckny</title> 
    <link type="text/css" rel="stylesheet" href="http://www.iscriptdesign.com/svgopen/presentation/css/present.css"/>
    <style type="text/css">
    <!--
      body {
        color: #000000;
        background-color: #ffffff;
      }
      .container {
         align: center;
	 margin: auto;
	 width: 80%;
	 height: 80%;
      }
      .svg_border {
         border: 1px solid black;
         width: 60%;
	 height: 50%;
      }

      a {
        color: inherit;
        background-color: inherit;
        font: inherit;
        text-decoration: inherit;
      }
      a:hover {
        text-decoration: underline;
      }
    -->
    </style>
<script type="text/javascript" src="../js/iscriptdesign.js"></script>

<script src="../js/jquery-1.6.1-min.js" type="text/javascript"></script>
<script type="text/javascript" src="../js/iPath.js"></script>
<script src="../js/jquery-ui-1.8.14.custom.min.js" type="text/javascript"></script>
<script type="text/javascript">
viewBoxTxt = 'viewBox="-20 0 220 250"';
$(function() {
   char={};
   char.svg  = document.getElementsByTagName('svg')[0];
   char.path = char.svg.getElementsByClassName('tekst')[0];


   char.func = function() {
       char.path.setAttribute('d', evalPath("#{'M 20 90' +  words.form(char.tekst).skew(0.3, 0).dPath(3)}", false));
       viewboxTxt = '' + char.view + ' 0 400 160';
       char.svg.setAttribute('viewBox', viewboxTxt);
       $('.vbt').text('viewBox="' + viewboxTxt + '"');
   };

buildInput('var:char.view, label:view, defaultvalue:0, type:slider, max:1000, min:-100, step:5, size:3', {panelid: '#below', func:char.func});
buildInput('var:char.tekst, label:text, defaultvalue:back to schoolback to schoolback to schoolback to schoolback to school, type:textfield', {panelid: '#below', func:char.func});
   char.func();
});
</script>

    </head> 
<body class="jsxgraph_body"> 
<div class="container">
<div class="svg_border ">
  <svg xmlns="http://www.w3.org/2000/svg" version="1.1"  baseProfile="full" viewbox="-20 0 220 250"> 
<g stroke="black" stroke-width="1" fill="none" transform="scale(1)">
<path class="tekst"/>
</g>
  </svg>
</div>
<div id='below'>
<div class="vbt">viewBox="-20 0 220 250"</div>
</div>
</div>
</body> 
</html> 
